<template>
  <no-ssr>
    <div class="page-mobile-user-editDetail">
      <!-- <div class="edit-title">
      <van-nav-bar :title="getTitle">
        <template #left>
          <van-icon name="arrow-left" @click="onClickLeft" />
        </template>
        <template v-if="!['wechatId'].includes(info)" #right>
          <span @click="handleSubmit">{{
            $t("locale.mobile.editDetail.t1")
          }}</span>
        </template>
      </van-nav-bar>
    </div> -->
      <!-- <white-header :isShowTopNav="true" :isShowBack="true" :isShowRight="true" :title="getTitle"></white-header> -->
      <div :class="['header-top']">
        <div class="header_left" @click="$router.back()">
          <span>取消</span>
        </div>
        <div class="center_title">{{ getTitle }}</div>
        <div class="header_right" @click="handleSubmit">
          <span>完成</span>
        </div>
      </div>
      <div class="fixed-box"></div>
      <div class="setting-box">
        <template v-if="info == 'avatar'">
          <div class="avatar_box">
            <!-- <van-uploader :after-read="afterRead"> -->
            <Upload
              class="avatar-uploader"
              ref="avatar-uploader"
              action=""
              :before-upload="afterRead"
              :show-file-list="false"
              :auto-upload="false"
              :show-upload-list="false"
              @click="false"
            >
              <div class="avatar-contain-box">
                <img
                  class="avatar"
                  v-lazy="user_info.avatar"
                  :key="user_info.avatar"
                />
              </div>
            </Upload>
            <!-- </van-uploader> -->
            <div class="tips">{{ $t("locale.mobile.editDetail.t2") }}</div>
          </div>
        </template>
        <template v-if="info == 'idNumber'">
          <van-cell-group>
            <van-field
              v-model="user_info.idNumber"
              clearable
              :placeholder="$t('locale.mobile.editDetail.t4')"
            />
          </van-cell-group>
        </template>
        <template v-if="info == 'gender'">
          <van-field name="radio" :label="$t('locale.mobile.editDetail.t5')">
            <template #input>
              <van-radio-group v-model="gender" direction="horizontal">
                <van-radio :name="1">{{
                  $t("locale.mobile.editDetail.male")
                }}</van-radio>
                <van-radio :name="0">{{
                  $t("locale.mobile.editDetail.female")
                }}</van-radio>
              </van-radio-group>
            </template>
          </van-field>
        </template>
        <template v-if="info == 'acName'">
          <van-field
            v-model="user_info.acName"
            clearable
            :placeholder="$t('locale.mobile.editDetail.t7')"
          />
        </template>
        <template v-if="info == 'originalMajor'">
          <van-field
            v-model="user_info.originalMajor"
            clearable
            placeholder="请输入专业/部门"
          />
        </template>
        <template v-if="info == 'originalSchool'">
          <van-field
            v-model="user_info.originalSchool"
            clearable
            placeholder="请输入学校/单位"
          />
        </template>
        <template v-if="info == 'birthday'">
          <van-datetime-picker
            v-model="birthday"
            :show-toolbar="false"
            type="date"
            :title="$t('locale.mobile.editDetail.t8')"
            :min-date="minDate"
            :max-date="maxDate"
          />
        </template>
        <template v-if="info == 'introduce'">
          <van-field
            v-model="user_info.introduce"
            type="textarea"
            rows="4"
            autosize
            maxlength="250"
            placeholder="请输入个人简介，最多输入250字"
          />
        </template>
        <template v-if="info == 'wechatId'">
          <van-button class="wc-btn" type="primary" @click="handleSubmit">{{
            $t("locale.mobile.editDetail.t11")
          }}</van-button>
        </template>
        <template v-if="info == 'password'">
          <van-form @submit="onSubmit" :show-error="true" ref="passform">
            <!-- 邮箱修改密码 -->
            <van-field
              v-model="user_info.email"
              :disabled="forgetPass != 1"
              v-if="web_info.VERIFY_TYPE == 0"
              :label="$t('locale.mobile.editDetail.t12')"
              :placeholder="$t('locale.mobile.editDetail.t13')"
              class="email_box"
              :rules="[
                { required: true, message: $t('locale.mobile.editDetail.t14') },
                {
                  pattern: /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/,
                  message: $t('locale.mobile.editDetail.t15')
                }
              ]"
            >
              <template #button>
                <van-button
                  size="small"
                  type="info"
                  :disabled="
                    seconds !== 0 ||
                      !/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(
                        user_info.email
                      )
                  "
                  native-type="button"
                  @click.stop="getCode('email')"
                  >{{
                    seconds !== 0
                      ? seconds + $t("locale.mobile.editDetail.t16")
                      : $t("locale.mobile.editDetail.t17")
                  }}</van-button
                >
              </template>
            </van-field>
            <van-field
              v-model="code"
              v-if="web_info.VERIFY_TYPE == 0"
              :label="$t('locale.mobile.editDetail.t18')"
              :placeholder="$t('locale.mobile.editDetail.t19')"
              :rules="[
                { required: true, message: $t('locale.mobile.editDetail.t20') }
              ]"
            />
            <!-- 邮箱修改密码 -->
            <!-- 手机修改密码 -->
            <van-field
              v-if="web_info.VERIFY_TYPE == 1"
              v-model="user_info.mobile"
              :disabled="forgetPass != 1"
              :label="$t('locale.mobile.regist.t12')"
              :placeholder="$t('locale.mobile.regist.t13')"
              :rules="[
                { required: true, message: $t('locale.mobile.regist.t14') },
                {
                  pattern: /^1(3|4|5|6|7|8|9)\d{9}$/,
                  message: $t('locale.mobile.regist.t15')
                }
              ]"
            >
              <template #button>
                <van-button
                  size="small"
                  type="info"
                  :disabled="
                    seconds !== 0 ||
                      !/^1(3|4|5|6|7|8|9)\d{9}$/.test(user_info.mobile)
                  "
                  native-type="button"
                  @click.stop="getCode('mobile')"
                  >{{
                    seconds !== 0
                      ? seconds + $t("locale.mobile.regist.t6")
                      : $t("locale.mobile.regist.t7")
                  }}</van-button
                >
              </template>
            </van-field>
            <van-field
              v-model="code"
              v-if="web_info.VERIFY_TYPE == 1"
              :label="$t('locale.mobile.regist.t8')"
              :placeholder="$t('locale.mobile.regist.t36')"
              :rules="[
                { required: true, message: $t('locale.mobile.regist.t10') }
              ]"
            />
            <!-- 手机修改密码 -->
            <van-field
              v-model="newPwd"
              type="password"
              :label="$t('locale.mobile.editDetail.t22')"
              :placeholder="$t('locale.mobile.editDetail.t23')"
              :rules="[
                { required: true, message: $t('locale.mobile.editDetail.t24') },
                {
                  pattern: /^[a-zA-Z0-9\S,.!@$^&*-=+`~?:;]{6,16}$/,
                  message: $t('locale.mobile.editDetail.t25')
                }
              ]"
            />
          </van-form>
        </template>
        <template v-if="info == 'mobile'">
          <!-- 配置了手机短信 验证手机短信验证码 -->
          <van-form
            @submit="handleSubmit"
            ref="mobileForm"
            v-if="web_info.VERIFY_TYPE == '1'"
          >
            <van-field
              v-model="param.mobile"
              :label="$t('locale.mobile.regist.t12')"
              :placeholder="$t('locale.mobile.regist.t13')"
              :rules="[
                { required: true, message: $t('locale.mobile.regist.t14') },
                {
                  pattern: /^1(3|4|5|6|7|8|9)\d{9}$/,
                  message: $t('locale.mobile.regist.t15')
                },
                { validator: validateMobile, message: '该手机号与当前一致' }
              ]"
            >
              <template #button>
                <van-button
                  size="small"
                  type="info"
                  :disabled="
                    seconds !== 0 ||
                      !/^1(3|4|5|6|7|8|9)\d{9}$/.test(param.mobile) ||
                      !validateMobile(param.mobile)
                  "
                  native-type="button"
                  @click.stop="sendPhoneCode('update')"
                  >{{
                    seconds !== 0
                      ? seconds + $t("locale.mobile.regist.t6")
                      : $t("locale.mobile.regist.t7")
                  }}</van-button
                >
              </template>
            </van-field>
            <van-field
              v-model="param.code"
              :label="$t('locale.mobile.regist.t8')"
              :placeholder="$t('locale.mobile.regist.t36')"
              :rules="[
                { required: true, message: $t('locale.mobile.regist.t10') },
                {
                  pattern: respond_code,
                  message: $t('locale.mobile.regist.t11')
                }
              ]"
            />
          </van-form>
          <van-form @submit="handleSubmit" ref="mobileForm" v-else>
            <van-field
              v-model="param.mobile"
              :label="$t('locale.mobile.regist.t12')"
              :placeholder="$t('locale.mobile.regist.t13')"
              :rules="[
                { required: true, message: $t('locale.mobile.regist.t14') },
                {
                  pattern: /^1(3|4|5|6|7|8|9)\d{9}$/,
                  message: $t('locale.mobile.regist.t15')
                },
                { validator: validateMobile, message: '该手机号与当前一致' }
              ]"
            >
            </van-field>
          </van-form>
        </template>
        <template v-if="info == 'email'">
          <van-form @submit="handleSubmit" ref="emailForm">
            <van-field
              v-model="param.email"
              :label="$t('locale.mobile.regist.t2')"
              :placeholder="$t('locale.mobile.regist.t3')"
              class="email_box"
              :rules="[
                { required: true, message: $t('locale.mobile.regist.t4') },
                {
                  pattern: /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/,
                  message: $t('locale.mobile.regist.t5')
                },
                { validator: validateEmail, message: '该邮箱与当前一致' }
              ]"
            >
              <template #button>
                <van-button
                  size="small"
                  type="info"
                  :disabled="
                    seconds !== 0 ||
                      !/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(
                        param.email
                      ) ||
                      !validateEmail(param.email)
                  "
                  native-type="button"
                  @click.stop="sendEmailCode('update')"
                  >{{
                    seconds !== 0
                      ? seconds + $t("locale.mobile.regist.t6")
                      : $t("locale.mobile.regist.t7")
                  }}</van-button
                >
              </template>
            </van-field>
            <van-field
              v-model="param.code"
              :label="$t('locale.mobile.regist.t8')"
              :placeholder="$t('locale.mobile.regist.t9')"
              :rules="[
                { required: true, message: $t('locale.mobile.regist.t10') },
                {
                  pattern: respond_code,
                  message: $t('locale.mobile.regist.t11')
                }
              ]"
            />
          </van-form>
        </template>
        <template v-if="info == 'gradeId'">
          <van-field
            readonly
            clickable
            name="picker"
            :value="formatValue(gradeList, intentionForm.gradeId)"
            label="当前年级"
            placeholder="点击选择年级"
            @click="showGradePicker = true"
          />
        </template>
        <template v-if="info == 'schoolCollegeId'">
          <van-field
            readonly
            clickable
            name="picker"
            :value="formatValue(schoolList, intentionForm.schoolCollegeId)"
            label="报考院校"
            placeholder="点击选择报考院校"
            @click="showSchoolPicker = true"
          />
        </template>
        <!-- <div class="submit-btn" @click="handleSubmit">提交</div> -->
      </div>
      <van-popup v-model="showGradePicker" position="bottom">
        <van-picker
          title="年级"
          show-toolbar
          :columns="gradeList"
          value-key="name"
          @confirm="onGradeConfirm"
          @cancel="showGradePicker = false"
        />
      </van-popup>
      <van-popup v-model="showSchoolPicker" position="bottom">
        <van-picker
          title="报考院校"
          show-toolbar
          :columns="schoolList"
          value-key="name"
          @confirm="onSchoolConfirm"
          @cancel="showSchoolPicker = false"
        />
      </van-popup>
    </div>
  </no-ssr>
</template>

<script>
import { mapState, mapMutations,mapActions } from "vuex";
import {
  userInfoUpdate,
  uploadAvatar,
  updatePass,
  getEmailCode,
  unbindWechat,
  getSmsCode,
  resetPass,
  getVerifyCode,
  updateUserPwd,
  getGradeSchoolList, updateGradeSchoolInfo
} from "~/api/account/user.js";
import WhiteHeader from "~/components/mobile/WhiteHeader.vue";
import { strToHexCharCode, hexCharCodeToStr } from "~/utils/commonfun";
export default {
  components: {
    WhiteHeader
  },
  data() {
    return {
      gender: 0,
      birthday: new Date(),
      minDate: new Date(1970, 0, 1),
      maxDate: new Date(),
      newPwd: "", //新密码
      email: "", //邮箱
      seconds: 0, //倒计时
      interval: null, //定时器
      respond_code: new RegExp(""), //验证码
      code: "", //验证码
      param: {
        mobile: "", //手机号
        email: "" //电子邮箱
      },
      user_info: {
        introduce: ""
      },
      flagCode: false,
      intentionForm: {
        gradeId: null,
        schoolCollegeId: null
      },
      gradeList: [],
      schoolList: [],
      showGradePicker: false,
      showSchoolPicker: false,
    };
  },
  computed: {
    ...mapState({
      token(state) {
        return state.token;
      },
      user_info_obj(state) {
        return state.user_info;
      },
      // user_info(state) {
      //   let user_info_obj = {
      //     ...state.user_info
      //   };
      //   return user_info_obj;
      // },
      theme_color(state) {
        return state.theme_color;
      },
      web_info(state) {
        return state.web_info;
      }
    }),
    info() {
      return this.$route.query.info;
    },
    forgetPass() {
      return this.$route.query.forgetPass;
    },
    getTitle() {
      let title = "";
      switch (this.$route.query.info) {
        case "avatar":
          title = this.$t("locale.mobile.editDetail.t26");
          break;
        case "idNumber":
          title = this.$t("locale.mobile.editDetail.t27");
          break;
        case "gender":
          title = this.$t("locale.mobile.editDetail.t28");
          break;
        case "acName":
          title = this.$t("locale.mobile.editDetail.t29");
          break;
        case "birthday":
          title = this.$t("locale.mobile.editDetail.t30");
          break;
        case "introduce":
          title = this.$t("locale.mobile.editDetail.t31");
          break;
        case "wechatId":
          title = this.$t("locale.mobile.editDetail.t32");
          break;
        case "password":
          title = this.$t("locale.mobile.editDetail.t33");
          break;
        case "mobile":
          // title = this.$t("locale.mobile.editDetail.t33");
          title = "修改手机号";
          break;
        case "originalMajor":
          // title = this.$t("locale.mobile.editDetail.t33");
          title = "修改专业/部门";
          break;
        case "originalSchool":
          // title = this.$t("locale.mobile.editDetail.t33");
          title = "修改学校/部门";
          break;
        case "email":
          // title = this.$t("locale.mobile.editDetail.t33");
          title = "修改邮箱";
          break;
        case "gradeId":
          title = "修改年级";
          break;
        case "schoolCollegeId":
          title = "修改报考院校";
          break;
      }
      return title;
    }
  },
  watch: {},
  activated() {
    if (process.client) {
      //未登录
      if (
        !this.token &&
        this.user_info &&
        Object.keys(this.user_info).length == 0
      ) {
        //忘记密码
        if (this.info == "password" && this.forgetPass == 1) {
        } else {
          this.$router.replace("/m/login");
        }
        //已登录
      } else {
        this.gender = this.user_info.gender;
        this.birthday = new Date(this.user_info.birthday);
        this.user_info = { ...this.user_info_obj };
        this.intentionForm = {
          gradeId: this.user_info_obj.gradeId,
          schoolCollegeId: this.user_info_obj.schoolCollegeId
        }
        
        this.$nextTick(() => {
          document.body.scrollTop = 0;
          document.documentElement.scrollTop = 0;
        });
      }
    }
  },
  deactivated() {
    this.initState();
  },
  methods: {
    ...mapMutations(["UPDATE_USERINFO", "SET_IS_LOADING"]),
    ...mapActions(["initUser"]),
    // 函数参数必须是字符串，因为二代身份证号码是十八位，而在javascript中，十八位的数值会超出计算范围，造成不精确的结果，导致最后两位和计算的值不一致，从而该函数出现错误。
    // 详情查看javascript的数值范围
    checkIDCard(idcode){
        // 加权因子
        var weight_factor = [7,9,10,5,8,4,2,1,6,3,7,9,10,5,8,4,2];
        // 校验码
        var check_code = ['1', '0', 'X' , '9', '8', '7', '6', '5', '4', '3', '2'];

        var code = idcode + "";
        var last = idcode[17];//最后一位

        var seventeen = code.substring(0,17);

        // ISO 7064:1983.MOD 11-2
        // 判断最后一位校验码是否正确
        var arr = seventeen.split("");
        var len = arr.length;
        var num = 0;
        for(var i = 0; i < len; i++){
            num = num + arr[i] * weight_factor[i];
        }
        
        // 获取余数
        var resisue = num%11;
        var last_no = check_code[resisue];

        // 格式的正则
        // 正则思路
        /*
        第一位不可能是0
        第二位到第六位可以是0-9
        第七位到第十位是年份，所以七八位为19或者20
        十一位和十二位是月份，这两位是01-12之间的数值
        十三位和十四位是日期，是从01-31之间的数值
        十五，十六，十七都是数字0-9
        十八位可能是数字0-9，也可能是X
        */
        var idcard_patter = /^[1-9][0-9]{5}([1][9][0-9]{2}|[2][0][0|1][0-9])([0][1-9]|[1][0|1|2])([0][1-9]|[1|2][0-9]|[3][0|1])[0-9]{3}([0-9]|[X])$/;

        // 判断格式是否正确
        var format = idcard_patter.test(idcode);

        // 返回验证结果，校验码和格式同时正确才算是合法的身份证号码
        return last === last_no && format ? true : false;
    },
    onGradeConfirm(value, index) {
      this.intentionForm = {
        ...this.intentionForm,
        gradeId: value.id
      };
      this.showGradePicker = false;
    },
    onSchoolConfirm(value, index) {
      this.intentionForm = {
        ...this.intentionForm,
        schoolCollegeId: value.id
      };
      this.showSchoolPicker = false;
    },
    formatValue(option, type) {
      if (!type) {
        return "";
      }
      let obj = option.find(item => item.id == type);
      if (obj) {
        return obj.name;
      } else {
        return "";
      }
    },
    async getGradeSchoolList() {
      this.SET_IS_LOADING(true);
      let result = await getGradeSchoolList();
      if (result && result.data && result.data.code == 200) {
        this.gradeList = result.data.data.grades;
        this.schoolList = result.data.data.schoolColleges;
      } else {
        this.$toast("获取失败");
      }
      this.SET_IS_LOADING(false);
    },
    // 忘记密码--获取验证码
    async getCode(type) {
      let param = {};
      if (type == "mobile") {
        param = {
          account: this.user_info.mobile,
          mobile: this.user_info.mobile
        };
      } else if (type == "email") {
        param = {
          account: this.user_info.email,
          email: this.user_info.email
        };
      }
      if (this.flagCode) {
        return false;
      }
      this.flagCode = true;
      let result = await getVerifyCode(param);
      if (result && result.data && result.data.code == 200) {
        this.flagCode = false;
        this.seconds = 60;
        this.cuntDown();
      } else if (result && result.data && result.data.code == 1) {
        this.$notify({
          type: "danger",
          message: res.data.msg
        });
      } else if (result && result.data && result.data.code == 2) {
        this.$notify({
          type: "danger",
          message: res.data.msg
        });
      } else {
        this.$notify({
          type: "danger",
          message: "发送失败"
        });
      }
    },
    validateMobile(val) {
      return !new RegExp("^" + this.user_info.mobile + "$").test(
        val.replace(/ /g, "")
      );
    },
    validateEmail(val) {
      return !new RegExp("^" + this.user_info.email + "$").test(
        val.replace(/ /g, "")
      );
    },
    trimDate(date) {
      if (date) {
        let _date = new Date(date);
        return `${_date.getFullYear()}-${_date.getMonth() +
          1}-${_date.getDate()}`;
      } else {
        return this.$t("locale.mobile.editDetail.unknow");
      }
    },
    afterRead(file) {
      let params = {
        id: this.user_info.id,
        file: file
      };
      this.uploadAvatarFun(params);
      return false;
    },
    async uploadAvatarFun(params) {
      let fd = new FormData();
      Object.keys(params).forEach(i => {
        fd.append(i, params[i]);
      });
      let result = await uploadAvatar(fd);
      if (result && result.data.code == 200) {
        this.UPDATE_USERINFO({
          avatar: result.data.data
        });
        this.user_info = {
          ...this.user_info,
          avatar: result.data.data
        };
        this.$toast(this.$t("locale.mobile.editDetail.t34"));
      } else {
        this.$toast(
          this.$t("locale.mobile.editDetail.t35") + result &&
            result.data &&
            result.data.msg
        );
      }
    },
    onClickLeft() {
      this.$router.back();
    },
    async updateUser(params) {
      let fd = new FormData();
      Object.keys(params).forEach(i => {
        fd.append(i, params[i]);
      });
      let result = await userInfoUpdate(fd);
      if (result && result.data && result.data.code == 200) {
        this.UPDATE_USERINFO(result.data.data);
        this.$toast(this.$t("locale.mobile.editDetail.t34"));
        // console.log("修改成功");
        switch (this.$route.query.info) {
          case "wechatId":
            this.$router.replace("/m/edit");
            break;
          case "mobile":
            this.initState();
            this.$router.back();
            break;
          case "email":
            this.initState();
            this.$router.back();
            break;
        }
        this.$router.back();
      } else {
        this.$toast(
          this.$t("locale.mobile.editDetail.t35") + result &&
            result.data &&
            result.data.msg
        );
      }
    },
    async handleSubmit() {
      if(this.info == "gradeId" || this.info == "schoolCollegeId"){
        this.SET_IS_LOADING(true);
        let params = {
            id:this.user_info_obj.id,
            ...this.intentionForm
        }
        let result = await updateGradeSchoolInfo(params);
        if (result && result.data && result.data.code == 200) {
            this.initUser();
            this.$toast(this.$t("locale.mobile.editDetail.t34"));
            this.$router.back();
        } else {
            this.$toast("提交失败");
        }
        this.SET_IS_LOADING(false);
        return;
      }
      if (this.info == "password") {
        let res = await this.$refs["passform"].validateAll().catch(e => e);
        console.log("修改密码：", res);
        if (res && res.length > 0) {
          return;
        } else {
          this.$refs["passform"].submit();
          return;
        }
      } else if (this.info == "mobile") {
        //修改手机号验证表单
        let res = await this.$refs["mobileForm"].validateAll().catch(e => e);
        console.log("res:", res);
        if (res && res.length > 0) {
          return;
        }
      } else if (this.info == "email") {
        //修改邮箱验证表单
        let res = await this.$refs["emailForm"].validateAll().catch(e => e);
        console.log("res:", res);
        if (res && res.length > 0) {
          return;
        }
      }
      let params = {
        id: this.user_info.id
      };
      const {
        idNumber,
        acName,
        gender,
        introduce,
        birthday,
        originalMajor,
        originalSchool
      } = this.user_info;
      if (this.info == "idNumber" && !this.checkIDCard(idNumber)) {
        this.$toast("请输入正确的身份证");
        return;
      }
      if (this.info == "wechatId") {
        let result = await unbindWechat({
          id: this.user_info.id,
          unbind: true
        });
        if (result && result.data && result.data.code == 200) {
          this.UPDATE_USERINFO(result.data.data);
          this.$router.replace("/m/edit");
          this.$toast(this.$t("locale.mobile.editDetail.t36"));
        } else {
          this.$toast(this.$t("locale.mobile.editDetail.t37"));
        }
        return;
      }
      switch (this.info) {
        case "idNumber":
          params = {
            ...params,
            idNumber
          };
          break;
        case "acName":
          params = {
            ...params,
            acName
          };
          break;
        case "originalMajor":
          params = {
            ...params,
            originalMajor
          };
          break;
        case "originalSchool":
          params = {
            ...params,
            originalSchool
          };
          break;
        case "birthday":
          let birthday = this.trimDate(this.birthday);
          params = {
            ...params,
            birthday:
              birthday == this.$t("locale.mobile.editDetail.unknow")
                ? null
                : birthday
          };
          break;
        case "introduce":
          params = {
            ...params,
            introduce
          };
          break;
        case "gender":
          params = {
            ...params,
            gender: this.gender
          };
          break;
        case "mobile":
          params = {
            ...params,
            mobile: this.param.mobile
          };
        case "email":
          params = {
            ...params,
            email: this.param.email
          };
        // case "wechatId":
        //   params = {
        //     ...params,
        //     wechatId: " ",
        //     unbind: true
        //   };
        //   break;
        // case "password":
        //   params = {
        //     ...params,
        //     gender: this.gender
        //   };
        //   break;
      }
      this.updateUser(params);
    },
    handleInput(val) {
      console.log(val);
    },
    sendEmailCode(type) {
      let param = {
        to: this.user_info.email
      };
      if (type == "update") {
        param = {
          to: this.param.email
        };
      }
      getEmailCode(param).then(res => {
        if (res && res.data && res.data.code == 200) {
          this.respond_code = new RegExp(hexCharCodeToStr(res.data.data.code));
          this.seconds = 60;
          this.cuntDown();
        } else {
          if (res && res.data && res.data.code == 204) {
            this.$notify({
              type: "danger",
              message: "该邮箱未绑定账号"
            });
          } else {
            this.$notify({
              type: "danger",
              message: this.$t("locale.mobile.editDetail.t38")
            });
          }
        }
      });
    },
    sendPhoneCode(type) {
      let param = {
        number: this.user_info.mobile
      };
      if (type == "update") {
        param = {
          number: this.param.mobile
        };
      }
      getSmsCode(param).then(result => {
        if (result && result.data && result.data.code == 200) {
          this.respond_code = new RegExp(
            hexCharCodeToStr(result.data.data.RequestId)
          );
          this.seconds = 60;
          this.cuntDown();
        } else {
          if (result && result.data && result.data.code == 204) {
            this.$notify({
              type: "danger",
              message: "该手机未绑定账号"
            });
          } else {
            this.$notify({
              type: "danger",
              message: $t("locale.mobile.regist.t35")
            });
          }
        }
      });
    },
    cuntDown() {
      this.interval = setInterval(() => {
        this.seconds--;
        if (this.seconds <= 0) {
          this.seconds = 0;
          clearInterval(this.interval);
        }
      }, 1000);
    },
    async onSubmit() {
      //忘记密码
      if (this.forgetPass == 1) {
        let params = {
          code: this.code,
          newPwd: this.newPwd
        };
        if (this.web_info.VERIFY_TYPE == 0) {
          params = {
            ...params,
            account: this.user_info.email
          };
        } else if (this.web_info.VERIFY_TYPE == 1) {
          params = {
            ...params,
            account: this.user_info.mobile
          };
        }
        let result = await updateUserPwd(params);
        if (result && result.data && result.data.code == 200) {
          this.$toast(this.$t("locale.mobile.editDetail.t34"));
          this.$router.replace("/m/login");
        } else if (result && result.data && result.data.code == 1) {
          this.$toast(result.data.msg);
        } else {
          this.$toast(this.$t("locale.mobile.editDetail.t35"));
        }
        //修改密码
      } else {
        let params = {
          userId: this.user_info.id,
          newPwd: this.newPwd
        };
        let result = await updatePass(params);
        if (result && result.data && result.data.code == 200) {
          this.$toast(this.$t("locale.mobile.editDetail.t34"));
          this.$router.replace("/m/user");
        } else {
          this.$toast(this.$t("locale.mobile.editDetail.t35"));
        }
      }
    },
    handleChange(val, type) {
      if (type == "email") {
        this.UPDATE_USERINFO({
          email: val
        });
      } else {
        this.UPDATE_USERINFO({
          mobile: val
        });
      }
    },
    initState() {
      this.gender = 0;
      this.birthday = new Date();
      this.minDate = new Date(1970, 0, 1);
      this.maxDate = new Date();
      this.newPwd = ""; //新密码
      this.email = ""; //邮箱
      this.seconds = 0; //倒计时
      this.interval = null; //定时器
      this.respond_code = new RegExp(""); //验证码
      this.code = ""; //验证码
      this.param = {
        mobile: "", //手机号码
        email: "" //邮箱
      };
    },
    handleMouseClick() {
      var event = document.createEvent("MouseEvents");
      event.initEvent("click", true, true);
      document.querySelector(".ivu-upload-input").dispatchEvent(event);
    }
  },
  created() {
    this.gender = this.user_info.gender;
    this.birthday = new Date(this.user_info.birthday);
    this.user_info = { ...this.user_info_obj };
    this.intentionForm = {
      gradeId: this.user_info_obj.gradeId,
      schoolCollegeId: this.user_info_obj.schoolCollegeId
    }
    if (this.token && Object.keys(this.user_info).length > 0) {
      this.getGradeSchoolList();
    }
    this.$nextTick(() => {
      document.body.scrollTop = 0;
      document.documentElement.scrollTop = 0;
    });
  },
  mounted() {}
};
</script>

<style lang="scss" scoped>
.page-mobile-user-editDetail {
  min-height: 100vh;
  background-color: #f5f7fa;
  .header-top {
    width: 7.2rem;
    height: 0.8rem;
    z-index: 999999;
    position: fixed;
    top: 0;
    left: 0;
    line-height: 0.8rem;
    display: flex;
    align-items: center;
    box-shadow: none;
    background-color: #ffffff;
    .header_left {
      width: 14%;
      color: #313233;
      font-size: 0.3072rem;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .center_title {
      width: 72%;
      text-align: center;
      font-size: 0.3456rem;
      color: #313233;
    }
    .header_right {
      width: 14%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #313233;
      font-size: 0.3072rem;
    }
  }
  .fixed-box {
    width: 7.2rem;
    height: 0.8rem;
  }
  .setting-box {
    border-top: 0.026rem solid #f7f7fa;
    margin-top: 0.192rem;
    .avatar_box {
      .tips {
        // margin-top: -.3rem;
        width: 7.2rem;
        font-size: 0.24rem;
        text-align: center;
        color: #969799;
      }
    }
    .avatar-cell {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 1.12rem;
      width: 1.12rem;
      height: 1.12rem;
      overflow: hidden;
      > img {
        width: 100%;
        height: auto;
      }
    }
    .submit-btn {
      width: 5.568rem;
      margin: 0.3rem auto 0.3rem;
      height: 0.768rem;
      line-height: 0.768rem;
      border-radius: 0.384rem;
      text-align: center;
      font-size: 0.3rem;
      font-weight: bold;
      background: var(--theme-color);
      color: #ffffff;
    }
  }
  .edit-title {
    height: 0.8rem;
  }
  .avatar-cell {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 1.12rem;
    width: 1.12rem;
    height: 1.12rem;
    overflow: hidden;
    > img {
      width: 100%;
      height: auto;
    }
  }
}
</style>
<style lang="scss">
.page-mobile-user-editDetail {
  .van-nav-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 7.2rem;
    height: 0.8rem;
    line-height: 0.8rem;
    background-color: var(--theme-color);
    .van-nav-bar__arrow {
      font-size: 0.35rem;
    }
    .van-nav-bar__left,
    .van-nav-bar__right {
      padding: 0.16rem;
      color: #fff;
      > i {
        font-size: 0.35rem;
        color: #fff;
      }
    }
    .van-nav-bar__text {
      font-size: 0.24rem;
    }
    .van-nav-bar__title {
      font-size: 0.28rem;
      color: #fff;
    }
  }
  .van-cell {
    padding: 0.2rem;
    font-size: 0.3072rem;
  }
  .van-field__control {
    font-size: 0.3072rem;
  }
  .avatar_box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    height: 4rem;
    background-image: linear-gradient(var(--theme-color), #fff);
    .van-image--round {
      background-color: #fff;
    }
    .avatar-contain-box {
      width: 2.2rem;
      height: 2.2rem;
      border-radius: 2.2rem;
      overflow: hidden;
      background-color: #fff;
      .avatar {
        width: 100%;
        height: 100%;
      }
    }
  }
  .wc-btn {
    margin: 0.2rem;
    border-radius: 0.08rem;
  }
}
</style>
